<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="../static/js/echarts.js"></script>
        <link rel="stylesheet" type="text/css" href="../static/css/example.css">
        <link rel="stylesheet" type="text/css" href="../static/css/layui.css" media="all">
        <link rel="stylesheet" href="../static/css/katex.css">
        <script src="../static/js/katex.js"></script>
        <script src="../static/js/jquery-2.1.4.js"></script>
        <script src="../static/js/mqtt.js"></script>
        <script src="../static/layui/layui.all.js"></script>
        <script src="../static/js/layer.js"></script>
        <style>
            img {
                display: block;
            }
            @font-face { font-family:'electronicFont'; src:url("../static/font/DS-Digital.ttf"); }

            /* #ledDisplay, #settings, #alarm, #realtimeCurve{margin: 10 auto; width: 600px; height: 400px;} */
            /** {padding: 5px; margin: 0;}*/
            /* 液晶显示背景 */
            .led{background-color: #242424; width: 100%; height: 300px; float: left; margin: 0px; padding: 0px;}
            /* 状态栏显示 */
            .ledState{color: #ffffff; width: 100%; height: 18%; font-size: 200%; text-align: center;}
            /* 安全温度及设定时间 */
            .ledSafeTimeVal{color: #ffffff; width: 100%; height: 20%; font-size: 200%; text-align: right; font-family: "electronicFont", serif;}
            .ledSafeVal{width: 48%; height: 100%; float: left; margin: 0px; padding: 0px; }
            .ledSafeValNum{width: 72%; height: 100%; float: left; font-size: 200%;}
            .ledTimeVal{width: 48%; height: 100%; float: right; margin: 0px; padding: 0px; }
            .ledTimeValNum{width: 70%; height: 100%; float: right; font-size: 200%;}
            /* 实时显示数据 */
            .ledChangingVal{color: #ffffff; width: 100%; height: 40%; font-size: 220%; text-align: right; font-family: "electronicFont", serif;}
            .ledChangingTempVal{width: 48%; height: 100%; float: left; margin: 0px; padding: 0px;}
            .ledChangingTempValNum{width: 72%; height: 100%; float: left; font-size: 220%;}
            .ledChangingSpeedVal{width: 50%; height: 100%; float: right; margin: 0px; padding: 0px;}
            .ledChangingSpeedValNum{width: 63%; height: 100%; float: left; font-size: 220%;}
            /* 设定值显示 */
            .ledSetVal{color: #b89602; width: 100%; height: 20%; font-size: 200%; text-align: right;
                font-family: "electronicFont", serif;}
            .ledSetTempVal{width: 48%; height: 100%; float: left; margin: 0px; padding: 0px; }
            .ledSetTempValNum{width: 72%; height:100%; float: left; font-size: 200%; }
            .ledSetSpeedVal{width: 50%;height: 100%; float: right; margin: 0px; padding: 0px; }
            .ledSetSpeedValNum{width: 63%; height: 100%; float: left; font-size: 200%; }
            /* 启停按钮和文字 */
            /* .btn{padding: 20px; background: url(buttonRunStop.png) 60px 60px no-repeat;} */
            #knob{float:left; width: 120px; height: 120px; margin: 20px; padding: 20px; }
            #knobPic{height: 100px; width: 100px; float: right; }
            #knobChar{text-align: center;}
            /* led字体显示 */
            .degree{float: left; text-align: center;}
            .rpm{float: left; text-align: center;}
            .sandclock{width: 15%; height: 100%; float: left; text-align: center;background: url('../static/img/timer.png') center center no-repeat; background-size: 100%; }
            .curve{width: 100%; height: 300px; margin: 0 auto; border: 0px solid #000000;}
            .PID_para{font-size: 20px; padding: 8px;}
            .PID_label{font-size: 20px;text-align: left;}
        </style>

    </head>
    <body>
    <script type="text/javascript" >
        function Alarm(inner_sensor_err,
                       inner_sensor_temp_alarm,
                       external_sensor_err,
                       external_sensor_over_temp,
                       mechanical_limit_temp_over_temp,
                       mechanical_limit_sensor_err,
                       motor_stalling,
                       external_sensor_drop,
                       end_of_time,
                       external_sensor_not_plugged
        ) {
            this.inner_sensor_err = inner_sensor_err;
            this.inner_sensor_temp_alarm = inner_sensor_temp_alarm;
            this.external_sensor_err = external_sensor_err;
            this.external_sensor_over_temp = external_sensor_over_temp;
            this.mechanical_limit_temp_over_temp = mechanical_limit_temp_over_temp;
            this.mechanical_limit_sensor_err = mechanical_limit_sensor_err;
            this.motor_stalling = motor_stalling;
            this.external_sensor_drop = external_sensor_drop;
            this.end_of_time = end_of_time;
            this.external_sensor_not_plugged = external_sensor_not_plugged;
        }

        let noerror = {
            "inner_sensor_err":0,
            "inner_sensor_temp_alarm":0,
            "external_sensor_err":0,
            "external_sensor_over_temp":0,
            "mechanical_limit_temp_over_temp":0,
            "mechanical_limit_sensor_err":0,
            "motor_stalling":0,
            "external_sensor_drop":0,
            "end_of_time":0,
            "external_sensor_not_plugged":0
        };
        let errorInfo;
        let errorInfoText = {
            "inner_sensor_err":"内部传感器故障",
            "inner_sensor_temp_alarm":"内部传感器温度报警",
            "external_sensor_err":"外部传感器故障",
            "external_sensor_over_temp":"外部传感器超温",
            "mechanical_limit_temp_over_temp":"机械限温超温",
            "mechanical_limit_sensor_err":"机械限温故障",
            "motor_stalling":"电机堵转",
            "external_sensor_drop":"外部传感器跌落",
            "end_of_time":"超时告警",
            "external_sensor_not_plugged":"外部传感器未插入"
        };
        function getDeviceAlarm(e) {
            let errorInfo = {
                "inner_sensor_err":0,
                "inner_sensor_temp_alarm":0,
                "external_sensor_err":0,
                "external_sensor_over_temp":0,
                "mechanical_limit_temp_over_temp":0,
                "mechanical_limit_sensor_err":0,
                "motor_stalling":0,
                "external_sensor_drop":0,
                "end_of_time":0,
                "external_sensor_not_plugged":0
            };
            errorInfo.inner_sensor_err = e & 1;
            errorInfo.inner_sensor_temp_alarm = e & 2;
            errorInfo.external_sensor_err = e & 4;
            errorInfo.external_sensor_over_temp = e & 8;
            errorInfo.mechanical_limit_temp_over_temp = e & 16;
            errorInfo.mechanical_limit_sensor_err = e & 32;
            errorInfo.motor_stalling = e & 64;
            errorInfo.external_sensor_drop = e & 128;
            errorInfo.end_of_time = e & 256;
            errorInfo.external_sensor_not_plugged = e & 512;
            return errorInfo;
        }
        let message;
        let device_data;
        let machinetype;
        //时间格式化函数,使用前必须定义
        Date.prototype.format = function(format){
            var o = {
                "M+" : this.getMonth()+1, //month
                "d+" : this.getDate(), //day
                "h+" : this.getHours(), //hour
                "m+" : this.getMinutes(), //minute
                "s+" : this.getSeconds(), //second
                "q+" : Math.floor((this.getMonth()+3)/3), //quarter
                "S" : this.getMilliseconds() //millisecond
            };

            if(/(y+)/.test(format)) {
                format = format.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
            }

            for(var k in o) {
                if(new RegExp("("+ k +")").test(format)) {
                    format = format.replace(RegExp.$1, RegExp.$1.length==1 ? o[k] : ("00"+ o[k]).substr((""+ o[k]).length));
                }
            }
            return format;
        };
        let userid = {{.UserID}};
        let gatewayid = {{.GatewayID}};
        let one_second = 1000;
        let timeArray = [""];
        let tempArray = ["0"];
        let speedArray = ["0"];
        let timeText;
        let flag = 600; //display time: 600s

        function addData(data) {
            if(data.ds === "" ||
                data.dt === "" ||
            data.ds > 320 ||
            data.dt > 55){}
            else {
                timeText = new Date().format("hh:mm:ss");
                timeArray.push(timeText);
                tempArray.push(data.dt);
                speedArray.push(data.ds);
                if (flag > 0) {
                    flag--;
                } else {
                    timeArray.shift();
                    tempArray.shift();
                    speedArray.shift();
                }
            }
        }
        function onsuccess() {
            console.log("sub success");
        }
        function onConnect() {
            console.log("onConnect");
            console.log("gatewayid======"+gatewayid+"/data");
        }
        function onConnectionLost(responseObject) {
            if (responseObject.errorCode !== 0)
                console.log("onConnectionLost:"+responseObject.errorMessage);
        }

        function guid() {
            function S4() {
                return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
            }
            return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
        }
        function onError(e) {
            console.log("error");
        }
        let client = mqtt.connect('ws://dcharles.work:8083/mqtt',{
            port: 8083,
            clientId: "webclient" + guid()
        });
        client.on('connect', function () {
            client.subscribe(gatewayid+'/data', function (err) {
                if (!err) {
                    console.log("connected");
                }
            });
        });
        client.on('message', function (topic, msg) {
            console.log("onMessageArrived:"+msg.toString());
            //一定要将转换为json对象
            message = JSON.parse(msg.toString());
            device_data = message.data;
            machinetype = device_data.mt;
            errorInfo = getDeviceAlarm(device_data.alarm);
            if (device_data.rs > 0) {
                document.getElementById('state').innerHTML = "设备正在运行";
            } else {
                document.getElementById('state').innerHTML = "设备已停止";
            }
            document.getElementById('safeTemp').innerHTML = 350;
            document.getElementById('time').innerHTML = device_data.dth+':'+device_data.dtm;
            document.getElementById('temp').innerHTML = device_data.dt;
            document.getElementById('speed').innerHTML = device_data.ds;
            document.getElementById('tempSetting').innerHTML = device_data.st;
            document.getElementById('speedSetting').innerHTML = device_data.ss;
            let div = document.getElementById('alarm');
            div.innerHTML = "";
            if (errorInfo.end_of_time === 0 &&
                errorInfo.external_sensor_drop === 0 &&
                errorInfo.external_sensor_err === 0 &&
                errorInfo.external_sensor_not_plugged === 0 &&
                errorInfo.external_sensor_over_temp === 0 &&
                errorInfo.inner_sensor_err === 0 &&
                errorInfo.inner_sensor_temp_alarm === 0 &&
                errorInfo.mechanical_limit_sensor_err === 0 &&
                errorInfo.mechanical_limit_temp_over_temp === 0 &&
                errorInfo.motor_stalling === 0) {
                console.log("zhengchang")
                console.log(errorInfo);
                let normal = document.createElement('div');
                normal.setAttribute("class", "layui-btn layui-btn-lg");
                normal.setAttribute("style", "margin: 3px;");
                normal.innerText = "设备正常";
                div.appendChild(normal);
            } else {
                console.log("gaojing")
                console.log(errorInfo);
                for (let key in errorInfo) {
                    if (errorInfo[key] !== 0) {
                        let alarm = document.createElement('div');
                        alarm.setAttribute("class", "layui-btn layui-btn-lg layui-btn-danger");
                        alarm.setAttribute("style", "margin: 3px;");
                        alarm.innerText = errorInfoText[key];
                        div.appendChild(alarm);
                    }
                }

            }
        });
        window.onbeforeunload=function(){
            client.end();
        };

        setInterval(function () {
            let tempOption = {
                title:{
                    text: '实时温度曲线'
                },
                tooltip:{
                    trigger: 'axis'
                },
                legend:{
                    data:["温度"]
                },
                toolbox: {
                    show: true,
                    feature: {
                        dataZoom: {
                            yAxisIndex: 'none'
                        },
                        dataView: {readOnly: false},
                        restore: {}
                    }
                },
                xAxis:{
                    data:timeArray
                },
                yAxis:{
                    type: 'value',
                    min: 20,
                    max: 50,
                    minInterval: 2,
                    axisLabel: {
                        formatter: '{value}'
                    }
                },
                series:[
                    {
                        name:'温度',
                        type:'line',
                        data:tempArray,
                        smooth: true,
                        markLine: {
                            data: [
                                {
                                    silent: false,
                                    lineStyle:{
                                        type: "solid",
                                        color: "#bf1818",
                                    },
                                    label: {
                                        position: 'middle',
                                        formatter: '安全温度'
                                    },
                                    yAxis: device_data.tr_max
                                }
                            ]
                        }
                    }
                ]
            };
            let speedOption = {
                title:{
                    text: '实时速度曲线'
                },
                tooltip:{
                    trigger: 'axis'
                },
                toolbox: {
                    show: true,
                    feature: {
                        dataZoom: {
                            yAxisIndex: 'none'
                        },
                        dataView: {readOnly: false},
                        restore: {}
                    }
                },
                legend:{
                    data:['速度']
                },
                xAxis:{
                    data:timeArray
                },
                yAxis:{
                    type: 'value',
                    min: 0,
                    max: 600,
                    minInterval: 20,
                    axisLabel: {
                        formatter: '{value}'
                    }
                },
                series:[
                    {
                        name:'速度',
                        type:'line',
                        data:speedArray,
                        smooth: true
                    }
                ]
            };

            addData(device_data, true);
            temp.setOption(tempOption);
            temp.resize();
            speed.setOption(speedOption);
            speed.resize();
        }, 1000);

    </script>

    <ul class="layui-nav" lay-filter="">
        <li class="layui-nav-item layui-this"><a href="/home">首页</a></li>
        <li class="layui-nav-item"><a href="/newband">添加设备</a></li>
        <li class="layui-nav-item"><a href="/airkiss">一键配网</a></li>
    </ul>

    <script>
        //注意：导航 依赖 element 模块，否则无法进行功能性操作
        layui.use('element', function(){
            let element = layui.element;
        });
    </script>
        <div class="layui-tab">
            <ul class="layui-tab-title">
                <li>实时曲线</li>
                <li>设备告警</li>
                <li class="layui-this">PID参数</li>
                <li>PID参数优化</li>
                <li>实时数据</li>
                <li>参数设置</li>


            </ul>
            <div class="layui-tab-content" style="height: 60px;">
                <div class="layui-tab-item">
                    <blockquote class="layui-elem-quote">网络状态：Wi-Fi</blockquote>
                    <div id="tempCurve" class="curve"></div>
                    <div id="speedCurve" class="curve"></div>
                    <script type="text/javascript">
                        let temp = echarts.init(document.getElementById('tempCurve'));
                        let speed = echarts.init(document.getElementById('speedCurve'));
                    </script>
                </div>
                <div id="alarm" class="layui-tab-item">
                    <blockquote  class="layui-elem-quote">网络状态：Wi-Fi</blockquote>

                    <div class="layui-btn layui-btn-lg" style="margin: 3px;">&nbsp;&nbsp;&nbsp;设备正常&nbsp;&nbsp;&nbsp;</div>
                </div>
                <div class="layui-tab-item  layui-show">
                    <div class="layui-btn layui-btn-lg" style="margin: 3px;" onclick="set_pid()">PID参数获取</div>
                    <div id="pidpara1">

                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>当前主对象模型PID参数</legend>
                        </fieldset>
                        <div  class="layui-form-item">
                            <label class="layui-form-label PID_label">KP：</label>
                            <div class="PID_para" id="P_para1">0.689</div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label PID_label">KI：</label>
                            <div class="PID_para" id="I_para1">0.019</div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label PID_label">KD：</label>
                            <div class="PID_para" id="D_para1">0.427</div>
                        </div>


                    </div>
                    <div id="pidpara2">

                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>当前副对象模型PID参数</legend>
                        </fieldset>
                        <div  class="layui-form-item">
                            <label class="layui-form-label PID_label">KP：</label>
                            <div class="PID_para" id="P_para2">0.187</div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label PID_label">KI：</label>
                            <div class="PID_para" id="I_para2">0.0023</div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label PID_label">KD：</label>
                            <div class="PID_para" id="D_para2">1.605</div>
                        </div>


                    </div>

                </div>
                <div class="layui-tab-item">
                    <div class="layui-btn layui-btn-lg" style="margin: 3px;" onclick="set_pid()">PID参数优化</div>
                    <div id="pidpara1">
                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>主对象模型传递函数</legend>
                        </fieldset>
                        <div class="layui-form-item">
                            <div  id="math1" style="font-size: 1.2em"></div>
                        </div>
                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>主对象模型PID参数</legend>
                        </fieldset>
                        <div  class="layui-form-item">
                            <label class="layui-form-label PID_label">KP：</label>
                            <div class="PID_para" id="P_para1">0.0789</div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label PID_label">KI：</label>
                            <div class="PID_para" id="I_para1">0.0181</div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label PID_label">KD：</label>
                            <div class="PID_para" id="D_para1">0.086</div>
                        </div>


                    </div>
                    <div id="pidpara2">
                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>副对象模型传递函数</legend>
                        </fieldset>
                        <div class="layui-form-item">
                            <div  id="math2" style="font-size: 1.2em"></div>
                        </div>
                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>副对象模型PID参数</legend>
                        </fieldset>
                        <div  class="layui-form-item">
                            <label class="layui-form-label PID_label">KP：</label>
                            <div class="PID_para" id="P_para2">1.59</div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label PID_label">KI：</label>
                            <div class="PID_para" id="I_para2">0.0015</div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label PID_label">KD：</label>
                            <div class="PID_para" id="D_para2">4.2</div>
                        </div>


                    </div>
                    <script>
                        let math1 = katex.render("G(s)=\\frac{4.97}{(2.18s+1)^2}e^{-5.49s}", document.getElementById("math1"));
                        $("#math1").html(math1);
                        let math2 = katex.render("G(s)=\\frac{2.06}{(5.3s+1)^2}e^{-1.6s}", document.getElementById("math2"));
                        $("#math2").html(math2);
                    </script>
                </div>
                <div class="layui-tab-item">
                    <blockquote class="layui-elem-quote">网络状态：Wi-Fi</blockquote>
                    <div id="ledDisplay" class="led" >
                        <!-- 液晶显示部分 -->
                        <div id="state" class="ledState">
                            <!-- 状态显示部分 -->

                        </div>
                        <!-- 第二排，显示安全温度和设定时间 -->
                        <div class="ledSafeTimeVal">
                            <div class="ledSafeVal">
                                <div  id="safeTemp" class="ledSafeValNum">
                                    <!-- 安全温度 -->

                                </div>
                                <div class="degree">
                                    ℃
                                </div>
                            </div>
                            <div class="ledTimeVal">
                                <div class="sandclock" ></div>
                                <div id="time" class="ledTimeValNum">
                                    <!-- 设定时间 -->

                                </div>
                            </div>
                        </div>
                        <!-- 第三排，显示实时温度和速度 -->
                        <div class="ledChangingVal">
                            <div class="ledChangingTempVal">
                                <div id="temp" class="ledChangingTempValNum">
                                    <!-- 实时温度 -->

                                </div>
                                <div class="degree">
                                    ℃
                                </div>
                            </div>
                            <div class="ledChangingSpeedVal">
                                <div id="speed" class="ledChangingSpeedValNum">
                                    <!-- 实时转速 -->

                                </div>
                                <div class="rpm">
                                    rpm
                                </div>
                            </div>
                        </div>
                        <!-- 第四排，显示设定温度和速度 -->
                        <div class="ledSetVal">
                            <div class="ledSetTempVal">
                                <div id="tempSetting" class="ledSetTempValNum">
                                    <!-- 显示设定温度 -->

                                </div>
                                <div class="degree">
                                    ℃
                                </div>
                            </div>
                            <div class="ledSetSpeedVal">
                                <div id="speedSetting" class="ledSetSpeedValNum">
                                    <!-- 显示设定转速 -->

                                </div>
                                <div class="rpm">
                                    rpm
                                </div>
                            </div>
                        </div>
                    </div>

                    <button id="knobPic" data-method="runstop" type="auto" class="layui-btn layui-btn-danger">启动/停止</button>
                    <button id="unband" data-method="runstop" type="auto" class="layui-btn layui-btn-danger">解除绑定</button>
                    <script type="text/javascript">
                        $('#unband').on("click", function () {
                            let url = "/unband?gateway_id=" + gatewayid;
                            $.ajax(
                                {
                                    url: url,
                                    type: "GET",
                                    success: function (e) {
                                        if (e.status === 'ok') {
                                            alert("解绑成功！");
                                            window.location.href = '/home';
                                            // location.reload();
                                        }
                                        if (e.status === "error") {
                                            alert("抱歉您没有操作权限，请向管理员申请！");
                                        }
                                    },
                                }
                            );
                        });
                    </script>
                    <script>
                        let layer;
                        layui.use('layer', function(){
                            layer = layui.layer;
                        });
                        let url_runstop = '/setmode';
                        let data_runstop = {
                            gateway_id: gatewayid,
                            user_id: userid,
                            params: {
                                type: 'startStop',
                                value: ''
                            }
                        };
                        function cancel() {
                            layer.msg('取消操作',{icon: 2});
                        }
                        function startAll() {
                            //全部启动
                            data_runstop.params.value = 'START_ALL';
                            $.ajax(
                                {
                                    url: url_runstop,
                                    type: "POST",
                                    dataType: 'json',
                                    data: JSON.stringify(data_runstop),
                                    success: function (e) {
                                        if (e.status === 'ok') {
                                            alert("操作成功！");
                                        }
                                        if (e.status === "error") {
                                            alert("抱歉您没有操作权限，请向管理员申请！");
                                        }
                                    },
                                }
                            )
                        }
                        function startHeat() {
                            data_runstop.params.value = 'START_HEAT';
                            $.ajax(
                                {
                                    url: url_runstop,
                                    type: "POST",
                                    dataType: 'json',
                                    data: JSON.stringify(data_runstop),
                                    success: function (e) {
                                        if (e.status === 'ok') {
                                            alert("操作成功！");
                                        }
                                        if (e.status === "error") {
                                            alert("抱歉您没有操作权限，请向管理员申请！");
                                        }
                                    },
                                }
                            )
                        }
                        function startStir() {
                            data_runstop.params.value = 'START_STIR';
                            $.ajax(
                                {
                                    url: url_runstop,
                                    type: "POST",
                                    dataType: 'json',
                                    data: JSON.stringify(data_runstop),
                                    success: function (e) {
                                        if (e.status === 'ok') {
                                            alert("操作成功！");
                                        }
                                        if (e.status === "error") {
                                            alert("抱歉您没有操作权限，请向管理员申请！");
                                        }
                                    },
                                }
                            )
                        }
                        function stopAll() {
                            //停止全部按钮
                            data_runstop.params.value = 'STOP_ALL';
                            $.ajax(
                                {
                                    url: url_runstop,
                                    type: "POST",
                                    dataType: 'json',
                                    data: JSON.stringify(data_runstop),
                                    success: function (e) {
                                        if (e.status === 'ok') {
                                            alert("操作成功！");
                                        }
                                        if (e.status === "error") {
                                            alert("抱歉您没有操作权限，请向管理员申请！");
                                        }
                                    },
                                }
                            )
                        }
                        $('#knobPic').on('click', function () {
                            if (machinetype === 100 || machinetype === 101) {
                                layer.confirm('启动/停止',{
                                        btn: ['取消', '全部启动', '启动加热', '启动搅拌', '全部停止']
                                    },
                                    cancel,
                                    startAll,
                                    startHeat,
                                    startStir,
                                    stopAll
                                );
                            } else {
                                layer.confirm('启动/停止',{
                                        btn: ['取消', '全部启动', '全部停止']
                                    },
                                    cancel,
                                    startAll,
                                    stopAll
                                );
                            }

                        });
                    </script>
                </div>
                <div class="layui-tab-item">
                    <blockquote class="layui-elem-quote">网络状态：Wi-Fi</blockquote>
                    <div class="layui-row layui-col-space20">
                        <div class="layui-col-xs12 layui-col-space10">
                            <div class="layui-row grid-demo">
                                <div class="layui-col-xs12">
                                    <form class="layui-form layui-form-pane" action="" >
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">设置温度</label>
                                            <div class="layui-input-block">
                                                <input type="text" id="set_temp" required  lay-verify="required" placeholder="请输入温度值" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">设置速度</label>
                                            <div class="layui-input-block">
                                                <input type="text" id="set_speed" required  lay-verify="required" placeholder="请输入速度值" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">设置小时</label>
                                            <div class="layui-input-block">
                                                <input type="text" class="layui-input" id="set_time_hour" placeholder="请输入小时值">
<!--                                                <span class="layui-badge layui-bg-orange">小时</span>-->
                                            </div>
                                        </div>
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">设置分钟</label>
                                            <div class="layui-input-block">
                                                <input type="text" class="layui-input" id="set_time_minute" placeholder="请输入分钟值">
                                            </div>
                                        </div>
                                        <div class="layui-form-item">
                                            <div class="layui-input-block">
                                                <script>
                                                    function submitSetting() {
                                                        let c = confirm("确定要提交吗？");
                                                        if (c === true) {
                                                            let url = 'http://dcharles.work/setparams';
                                                            let set_temp = document.getElementById('set_temp');
                                                            let set_speed = document.getElementById('set_speed');
                                                            let set_hour = document.getElementById('set_time_hour');
                                                            let set_minute = document.getElementById('set_time_minute');

                                                            let data = {
                                                                user_id: userid,
                                                                gateway_id: gatewayid,
                                                                machine_type: machinetype,
                                                                params: {
                                                                    type: 'SETTING_PARAMS',
                                                                    value: {}
                                                                }
                                                            };
                                                            if (set_temp.value !== ""){
                                                                data.params.value.st = set_temp.value;
                                                            }
                                                            if (set_speed.value !== ""){
                                                                data.params.value.ss = set_speed.value;
                                                            }
                                                            if (set_hour.value !== ""){
                                                                data.params.value.sth = set_hour.value;
                                                            }
                                                            if (set_minute.value !== ""){
                                                                data.params.value.stm = set_minute.value;
                                                            }
                                                            $.ajax({
                                                                url:url,
                                                                data:JSON.stringify(data),
                                                                dataType: 'json',
                                                                type: 'POST',
                                                                success: function (e) {
                                                                    if (e.status === 'ok') {
                                                                        alert("设定成功！");
                                                                    }
                                                                    if (e.status === 'error') {
                                                                        alert('设定失败！');
                                                                    }
                                                                }
                                                            })
                                                        }
                                                    }
                                                </script>
                                                <button class="layui-btn" onclick="submitSetting()">立即提交</button>
                                                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                                            </div>
                                        </div>
                                    </form>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>


            </div>
        </div>
    </body>
</html>